import React from 'react';
import { getCustomPost } from 'lib/post';
import { Post } from 'interface/post'
import styles from 'styles/page.module.scss'
import Layout from 'components/layout/index'
import { NextPageWithLayout } from 'pages/_app';

const postShow: NextPageWithLayout<Post> = (props) => {
  const { title, htmlContent } = props
  return (
    <div className={styles.container}>
      <h1 className={styles['custom-title']}>{title}</h1>
      <div className='markdown-body' dangerouslySetInnerHTML={{ __html: htmlContent }}></div>
    </div>
  );
};

postShow.getLayout = Layout

export default postShow;

export const getStaticProps = async (context: any) => {
  const post = await getCustomPost('about')
  return {
    props: JSON.parse(JSON.stringify(post)) || null
  };
};